<!--公示清单-->
<template>
  <div>
    <div style="display: flex; max-height: 20px; margin-left: -20px">
      <h5 style="margin-left: 30px">项目编号</h5>
      <el-input style="margin-top: -5px; width:120px; margin-left: 10px" placeholder="请输入项目编号" v-model="projectNumber"></el-input>
      <h5 style="margin-left: 30px">项目名称</h5>
      <el-input style="margin-top: -5px; width:120px; margin-left: 10px" placeholder="请输入项目名称" v-model="projectName" ></el-input>
      <el-button type="primary" style="margin-top: -5px; margin-left: 30px" icon="el-icon-search" @click="init">查询</el-button>
      <el-button type="warning" style="margin-top: -5px; margin-left: 10px" icon="el-icon-refresh" @click="reset">重置</el-button>
    </div>
    <div style="display: flex;">
      <el-table :data="tableData" style="margin-top: 10px" height="500">
        <el-table-column fixed label="序号"  width="45">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column prop="projectNumber" label="项目编号"></el-table-column>
        <el-table-column prop="projectName" label="项目名称"></el-table-column>
        <el-table-column prop="publicityName" label="公示名称"></el-table-column>
        <el-table-column prop="quantity" label="数量" width="45"></el-table-column>
        <el-table-column prop="budget" label="预算(万元)" width="80"></el-table-column>
        <el-table-column prop="projectType" label="项目类型" width="80"></el-table-column>
        <el-table-column prop="dealer" label="成交人(品牌)" ></el-table-column>
        <el-table-column prop="publicityDate" label="公示时间" width="180"></el-table-column>
        <el-table-column prop="tenderOfficer" label="招标负责人"></el-table-column>
        <el-table-column label="操作" width="200">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.status === 4 && scope.row.annoStatus === 5" type="danger">项目已有中标公司</el-tag>
            <el-button v-else type="success" @click="handleLook(scope.row)">查看</el-button>
            <el-button v-else type="danger" @click="handleClarify(scope.row)">发起澄清</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div style="padding: 10px 0;margin-left: 800px">
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageNum"
          :page-sizes="[10, 15, 20,30]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
      </el-pagination>
    </div>
<!--    查看-->
    <el-dialog :visible.sync="dialogLookVisible"
               style="text-align: center;"
               width="1000"
    >
      <div class="dialog-title" style="margin-top: -40px">{{ lookForm.dialogTitle }}</div>
      <el-descriptions title="" style="display: inline-block;" column="4" size="mini">
        <el-descriptions-item label="项目预算（万元）">{{lookForm.budget}}</el-descriptions-item>
        <el-descriptions-item label="采购人">{{ lookForm.applyingDepartment }}</el-descriptions-item>
        <el-descriptions-item label="开标时间">{{ lookForm.meetDate }}</el-descriptions-item>
        <el-descriptions-item label="进度">
          <span v-if="lookForm.status === 1">待公告</span>
          <span v-else-if="lookForm.status === 2">已公告</span>
          <span v-else-if="lookForm.status === 3">待公示</span>
          <span v-else-if="lookForm.status === 4">已公示</span>
          <span v-else-if="lookForm.status === 5">已完成</span>
        </el-descriptions-item>
      </el-descriptions>
      <el-card>
        <el-descriptions title="" style="" column="2" size="mini">
          <el-descriptions-item label="投标单位签到时间">{{ getAdjustedMeetDateF30(lookForm.meetDate) }}</el-descriptions-item>
          <el-descriptions-item label="资质审核时间">{{ getAdjustedMeetDateZ30(lookForm.meetDate) }}</el-descriptions-item>
          <el-descriptions-item label="开标时间">{{ lookForm.meetDate }}</el-descriptions-item>
          <el-descriptions-item label="开标地点">{{ lookForm.meetLoca }}</el-descriptions-item>
          <el-descriptions-item label="公告内容">{{lookForm.meetMemo}}</el-descriptions-item>
        </el-descriptions>
      </el-card>
    </el-dialog>
<!--    发起澄清-->
    <el-dialog :visible.sync="dialogClarifyVisible"
               :custom-class="'slide-right-dialog'"
    >
      <div style="border: 2px solid #409EFF; border-radius: 5px; padding: 20px; background-color: #f2f7fc; margin-bottom: 20px;">
        <el-descriptions :title="clarifyForm.title" style="display: inline-block;margin-top: -100px" column="4" size="mini">
          <el-descriptions-item label="采购方式">
            {{clarifyForm.procurementMethod}}
          </el-descriptions-item>
          <el-descriptions-item label="项目预算（万元）">{{ clarifyForm.budget }}</el-descriptions-item>
        </el-descriptions>
      </div>
      <div class="dialog-title"><i class="el-icon-d-arrow-right"></i>说明我的意见</div>
      <el-card>
        <el-form :model="clarifyForm" :rules="rules" :ref="clarifyForm" label-width="120px" class="demo-ruleForm custom-form" style="margin-top: 30px">
          <el-form-item label="企业名称" prop="departmentName">
            <el-input v-model="clarifyForm.departmentName"></el-input>
          </el-form-item>
          <el-form-item label="响应文件上传" prop="alrFileUrl">
            <el-upload
                :action="'http://'+serverIp() + ':8081/jdyfy/file/upload'"
                :show-file-list="true"
                :on-success="handleAnnounFile"
                :on-error="handleAnnounFileError"
                :limit="1">
              <el-button size="small" type="primary">选取文件</el-button>
              <div slot="tip" class="el-upload__tip">请上传不超过50mb的文件，只能上传一个文件</div>
            </el-upload>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="saveClarify">确定发送</el-button>
            <el-button @click="dialogClarifyVisible = false">取 消</el-button>
          </el-form-item>
        </el-form>
      </el-card>
    </el-dialog>
  </div>
</template>

<script>
import {getProjectPageByStatus, getProjectPageByStatusSpace} from "@/api/project";
import {addPublicityClarify, getPublicitysByProjectNumbers} from "@/api/publicity";
import {getMeetByProjectName} from "@/api/meet";
import {serverIp} from "../../../../public/config.js";

export default {
  data() {
    return {
      tableData: [],
      procurementMethod:'',
      projectNumber: "",
      projectName: "",
      pageNum: 1,
      total: 0,
      pageSize: 10,
      dialogClarifyVisible: false,
      dialogLookVisible: false,
      clarifyForm: {},
      lookForm: {},
    }
  },
  created() {
    this.init();
  },
  methods: {
    serverIp() {
      return serverIp
    },
    init() {
      getProjectPageByStatus(this.pageNum, this.pageSize, this.projectNumber, this.projectName, this.procurementMethod,4,4).then(res => {
        //根据项目名称查询公告信息
        const projects = res.records;
        const projectNumbers = projects.map(project => project.projectNumber);

        // 根据项目编号集合查询对应公示信息
        getPublicitysByProjectNumbers(projectNumbers).then(publicitys => {
          // 将公告信息添加到每个项目中
          projects.forEach(project => {
            const publicity = publicitys.find(a => a.projectNumber === project.projectNumber);
            // 添加公告名和数量到项目中
            project.publicityName = publicity ? publicity.publicityName : "无公示";
            project.dealer = publicity ? publicity.dealer : "无公示";
            project.publicityId = publicity ? publicity.publicityId : "无公示";
            project.publicityText = publicity ? publicity.publicityText : "无公示";

            // 添加公告的开始时间和结束时间
            const startTime = publicity ? publicity.publicityStartTime : "无公示";
            const endTime = publicity ? publicity.publicityEndTime : "无公示";
            if (startTime && endTime) {
              project.publicityDate =`${startTime} - ${endTime}`;
            }
          });
          this.tableData = projects;
          this.total = res.total;
        });
      });
    },
    handleClarify(row) { // 发起澄清
      this.clarifyForm.title = `${row.projectName}（招标项目编号${row.projectNumber}）`
      this.clarifyForm.budget = row.budget
      this.clarifyForm.procurementMethod = row.procurementMethod
      this.clarifyForm.departmentName = JSON.parse(localStorage.getItem('user')).department
      this.clarifyForm.publicityName = row.publicityName
      this.dialogClarifyVisible = true;
    },
    saveClarify() { // 提交澄清
        addPublicityClarify(this.clarifyForm).then(res => {
          if(res) {
            this.$message({
              type: 'success',
              message: '澄清发起成功'
            })
            this.dialogClarifyVisible = false
          }
        })
    },
    async handleLook(row) { //查看
      console.log(row)
      this.lookForm = row
      this.lookForm.dialogTitle = `${row.projectName}(招标项目编号：${row.projectNumber})`
      await getMeetByProjectName(row.projectName).then(res => {
        console.log(res)
        this.lookForm.meetDate = res ? res.meetTime : "暂无";
        this.lookForm.meetLoca = res ? res.meetLoca : "暂无";
        this.lookForm.meetMemo = res ? res.meetMemo : "暂无";
      })
      this.dialogLookVisible = true
    },
    getAdjustedMeetDateF30(meetDate) {
      if(meetDate === '暂无'){
        return '暂无'
      }
      // 如果 meetDate 是字符串，首先将它转换为 Date 对象
      let date = new Date(meetDate);
      // 将时间提前半小时
      date.setMinutes(date.getMinutes() - 30);
      // 返回格式化后的时间（这里使用 toLocaleString 作为示例）
      return date.toLocaleString();
    },
    getAdjustedMeetDateZ30(meetDate) {
      if(meetDate === '暂无'){
        return '暂无'
      }
      // 如果 meetDate 是字符串，首先将它转换为 Date 对象
      let date = new Date(meetDate);
      // 将时间提前半小时
      date.setMinutes(date.getMinutes() + 30);
      // 返回格式化后的时间（这里使用 toLocaleString 作为示例）
      return date.toLocaleString();
    },
    handleSizeChange(val) { // 改变页码
      this.pageSize = val;
      this.init();
    },
    handleCurrentChange(val) { // 改变每页显示条数
      this.pageNum = val;
      this.init();
    },
    handleAnnounFile(row){ //公告附件，row为公告文件附件下载路径
      this.clarifyForm.clarifyFileUrl = row
      this.$message.success('文件添加成功')
    },
    handleAnnounFileError(err, file, fileList) { //公告附件上传失败提示
      // 上传失败的处理逻辑
      this.$message.error('文件上传失败，请重试');
    },
    reset() {
      this.projectName = ''
      this.projectNumber = ''
      this.init();
    }
  }
}
</script>

<style scoped>
>>> .slide-right-dialog {
  top: -150px;
  right: 0;
  margin: 0;
  position: absolute;
  height: 1000px;
  width: 600px;
  animation: slide-right 0.3s ease;
}
>>> .slide-right-dialog .el-dialog__title {
  font-size: 14px; /* 调整对话框正文内容的字体大小 */
}
</style>
